import React, { Component } from 'react';
import { NavBar, } from 'antd-mobile'
import * as service from '../api/index'
import '../styles/Much.scss'
class Much extends Component {
    constructor(props) {
        super(props)
        this.state = {
            muchlist: []
        }
    }
    back() {
        this.props.history.goBack()
    }
    async componentDidMount() {
        var res = await service.much_list()
        // console.log(res.data);
        this.setState({ muchlist: res.data })
    }
    render() {
        return (
            <div className='much'>
                <div className="top">
                    <span onClick={() => { this.back() }}><NavBar>编辑推荐</NavBar></span>
                    <div className="con">
                        {
                            this.state.muchlist.map((item, index) => {
                                return (
                                    <div className="item" key={index}>
                                        <img src={item.pic} alt="" />
                                        <div className="box">
                                            <div className="title">{item.title}</div>
                                            <div className="name">{item.name}</div>
                                            <div className="desc">{item.desc}</div>
                                        </div>

                                    </div>
                                )
                            })
                        }
                    </div>
                </div>
            </div>
        );
    }
}

export default Much;